Polar Coordinate System এ ডেটা প্রদর্শন

Chart.js Polar Coordinate System ব্যবহার করে এমন চার্ট তৈরি করতে সহায়ক, যা সাধারণত একাধিক ভেরিয়েবল বা বিভাগের মধ্যে সম্পর্ক এবং পরিমাণ প্রদর্শনের জন্য ব্যবহৃত হয়। Polar Coordinate System চার্টগুলোর মধ্যে Polar Area Chart এবং Radar Chart দুটি প্রধান চার্ট টাইপ। এই ধরনের চার্টগুলো বিশেষত ত্রিমাত্রিক ডেটা বিশ্লেষণ এবং তুলনা করার জন্য উপযুক্ত।

Polar Coordinate System কি?

Polar Coordinate System একটি ভিন্ন ধরণের কোঅর্ডিনেট সিস্টেম যা ডেটাকে একটি কেন্দ্রীয় পয়েন্ট থেকে রেডিয়াল ভাবে রেন্ডার করে। এটি সাধারণত রেডিয়াস (বুদবুদ বা সেগমেন্টের আকার নির্ধারণকারী মান) এবং অ্যাঙ্গেল (একটি বৃত্তের মধ্যে এক্স-অক্ষ বা ওয়াই-অক্ষের সাথে কোণ) দ্বারা পরিচালিত হয়।

Chart.js এ Polar Area Chart এবং Radar Chart Polar Coordinate System ব্যবহার করে ডেটা প্রদর্শন করা হয়।

Polar Area Chart

Polar Area Chart Polar Coordinate System ব্যবহার করে ডেটাকে আকার এবং পরিমাণ অনুযায়ী সেগমেন্টে ভাগ করে প্রদর্শন করে। এটি সাধারণত এমন ডেটা দেখানোর জন্য ব্যবহৃত হয় যেখানে একাধিক বিভাগ বা ভিন্ন ভিন্ন সিরিজের মধ্যে তুলনা করতে হয়।

উদাহরণ: Polar Area Chart

const ctx = document.getElementById('myPolarChart').getContext('2d');
const myPolarChart = new Chart(ctx, {
    type: 'polarArea', // Polar Area Chart type
    data: {
        labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple'], // Labels for each section
        datasets: [{
            label: 'Vote Distribution',
            data: [12, 19, 3, 5, 2], // Data for each section
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)'
            ],
            borderColor: [
                'rgba(255, 99, 132, 1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        responsive: true, // Make the chart responsive
        scales: {
            r: {
                beginAtZero: true, // Start the radius from zero
            }
        }
    }
});

• type: 'polarArea': এখানে Polar Area Chart টাইপ ব্যবহার করা হয়েছে।
• labels: এক্স-অক্ষের লেবেলগুলোর জন্য ডেটা (যেমন 'Red', 'Blue', 'Yellow', ইত্যাদি)।
• datasets: এখানে ডেটা পয়েন্ট এবং সেগমেন্টের জন্য রঙ নির্ধারণ করা হয়েছে।
• backgroundColor: প্রতিটি সেগমেন্টের জন্য রঙ নির্ধারণ করা হয়।
• borderColor: সেগমেন্টের বর্ডার রঙ।
• r (Radius): স্কেল যেটি রেডিয়াস বা সেগমেন্টের আকার নির্ধারণ করে। এটি beginAtZero: true দিয়ে নিশ্চিত করা হয়েছে যে, রেডিয়াস শূন্য থেকে শুরু হবে।

Radar Chart

Radar Chart (বা Web Chart) একটি চতুর্ভুজ রিডিয়াল চার্ট, যেখানে একাধিক ডেটাসেটকে প্রতিটি সেগমেন্টে প্লট করা হয়। এটি সাধারণত একাধিক ভেরিয়েবলের তুলনা করতে ব্যবহৃত হয়।

উদাহরণ: Radar Chart

const radarCtx = document.getElementById('myRadarChart').getContext('2d');
const myRadarChart = new Chart(radarCtx, {
    type: 'radar', // Radar Chart type
    data: {
        labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding'], // Labels for each axis
        datasets: [{
            label: 'Activity Distribution',
            data: [10, 20, 30, 40, 50], // Data for each category
            fill: true, // Fill the area inside the chart
            backgroundColor: 'rgba(255, 99, 132, 0.2)', // Background color of the area
            borderColor: 'rgba(255, 99, 132, 1)', // Border color
            borderWidth: 1 // Border width
        }]
    },
    options: {
        responsive: true, // Make the chart responsive
        scales: {
            r: {
                beginAtZero: true, // Start the radial scale from zero
            }
        }
    }
});

• type: 'radar': এখানে Radar Chart টাইপ ব্যবহার করা হয়েছে।
• labels: এক্স-অক্ষের লেবেল (এটি সেগমেন্টের শিরোনাম হিসেবে কাজ করে)।
• datasets: একাধিক ডেটা সিরিজের জন্য ডেটা এবং স্টাইল কনফিগারেশন।
• backgroundColor: গ্রাফের ভিতরের রঙ।
• fill: true: এটি চার্টের ভিতরের এলাকা পূর্ণ করবে।
• borderColor: সেগমেন্টের সীমানার রঙ।
• r (Radius): রেডিয়াল স্কেল কনফিগারেশন।

Polar Coordinate System এর উপকারিতা

• বিভিন্ন ক্যাটাগরি বা সেগমেন্টের মধ্যে তুলনা: Polar Area Chart এবং Radar Chart ডেটার বিভিন্ন ভেরিয়েবল বা ক্যাটাগরির মধ্যে সম্পর্ক দেখাতে কার্যকরী।
• ডেটার আকার ও পরিমাণ প্রদর্শন: Polar Coordinate System ডেটার আকার এবং পরিমাণের একটি তুলনামূলক দৃশ্য প্রদান করে, যা সাধারণত চক্রাকার বা বৃত্তাকারভাবে প্রদর্শিত হয়।
• সহজ ভিজ্যুয়ালাইজেশন: এটি ডেটাকে খুব সহজ এবং কার্যকরভাবে উপস্থাপন করতে সহায়তা করে, বিশেষত যখন একাধিক ডেটাসেট বা ক্যাটাগরি থাকে।

সারাংশ

Chart.js এর Polar Coordinate System দুটি প্রধান চার্ট টাইপ—Polar Area Chart এবং Radar Chart—প্রদান করে, যা ডেটার ভিজ্যুয়ালাইজেশনকে আকর্ষণীয় এবং সহজ করে তোলে। Polar Area Chart একাধিক সেগমেন্টে ডেটা প্রদর্শন করে, যেখানে Radar Chart একাধিক ভেরিয়েবলের মধ্যে তুলনা করার জন্য ব্যবহৃত হয়। Polar Coordinate System-এর এই চার্টগুলি সাধারণত বিভিন্ন বিভাগ বা ভেরিয়েবলের মধ্যে সম্পর্ক এবং পরিমাণ প্রদর্শন করতে ব্যবহৃত হয়।